<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>vue生命周期</title>
    <script src="vue.js"></script>
</head>
<body>
<div id="app"></div>
<script>

    <!--生命周期函数就是vue实例会在某一个时间点自动执行的函数-->
    var vm = new Vue({
        el:"#app",
        template:"<div>{{message}}</div>",
        beforeCreate: function () {
            //Vue 实例在部分初始化的时候执行
            console.log("beforeCreate");
        },
        created:function(){
            //
            console.log('created');
        },
        beforeMount:function(){
            console.log(this.$el);
            console.log('beforeMount');
        },
        mounted:function(){
            console.log(this.$el);
            console.log('mounted');
        },
        beforeDestroy:function(){
            console.log('beforeDestory');
        },
        destroyed:function(){
            console.log('destory');
        },
        beforeUpdate:function(){
            console.log('beforeUpdate');
        },
        updated:function(){
            console.log('updated');
        },
        data:{
            message:"Hello vue!"
        },
        methods:{}
    });
</script>
</body>
</html>